<!--
 * @Author: GGbeng
 * @Date: 2022-01-04 14:09:27
 * @LastEditTime: 2022-01-14 11:44:14
 * @Description: 住院缴费
 * @FilePath: /hisapp/pages/hospitalization/index.vue
-->
<template>
	<view class="hospitalization">
		<view class="card">
			<u-form :model="form" ref="uForm" label-width="140">
				<u-form-item label="住院号" prop="recidenceNo"
					><u-input v-model="form.residenceNo" placeholder="请输入住院号"
				/></u-form-item>
				<u-form-item label="充值金额" prop="changeFee"
					><u-input
						v-model="form.changeFee"
						type="number"
						placeholder="请输入充值金额"
				/></u-form-item>
			</u-form>
			<view style="margin-top: 25rpx">
				<u-button
					type="primary"
					plain
					@click="handlerSubmit"
					:disabled="disabled"
					>确认充值</u-button
				>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
import { mapState } from 'vuex'
import {
	residenceRechange,
	residenceRechangeSelect,
	wxRefund,
} from '../../http/api'
export default {
	data() {
		return {
			form: {
				residenceNo: '',
				changeFee: 1,
			},
			disabled: false,
			rules: {
				residenceNo: [
					{
						required: true,
						message: '请输入住院号',
						trigger: ['change', 'blur'],
					},
				],
				changeFee: [
					{
						required: true,
						message: '请输入充值金额',
						trigger: ['change', 'blur'],
					},
				],
			},
		}
	},
	computed: {
		...mapState({
			orgCode: state => state.orgCode,
			patientIdentity: state => state.patientIdentity,
			patientcardNo: state => state.patientcardNo,
		}),
	},
	onReady() {
		this.$refs.uForm.setRules(this.rules)
	},
	methods: {
		handlerSubmit() {
			this.$refs.uForm.validate(valid => {
				if (valid) {
					this.disabled = true
					residenceRechangeSelect({
						orgCode: this.orgCode,
						cardType: 1,
						idCard: this.patientIdentity,
						cardNo: this.patientcardNo,
						...this.form,
					})
						.then(({ data, head }) => {
							if (head.code == 200) {
								this.$pay(data).then(() => {
									residenceRechange({
										orgCode: this.orgCode,
										cardType: 1,
										idCard: this.patientIdentity,
										cardNo: this.patientcardNo,
										tradeOrderId: data.orderId,
										tradeOrderNo: data.orderNo,
										...this.form,
									}).then(res => {
										// console.log(res, 333333)
										if (res.head.code == 200) {
											this.$refs.uToast.show({
												title: '充值成功',
												type: 'success',
												url: '/pages/index/index',
											})
										} else if (head.code == 400) {
											this.$refs.uToast.show({
												title: head.message,
												type: 'error',
											})
										}
									})
								})
							} else if (head.code == 400) {
								this.$refs.uToast.show({
									title: head.message,
									type: 'error',
								})
							}
							this.disabled = false
						})
						.catch(() => {
							this.disabled = false
						})
				}
			})
		},
	},
}
</script>

<style lang="scss">
page {
	height: 100%;
	background: #f3f3f3;
}
.hospitalization {
	height: 100%;
	padding: 10rpx;
	display: flex;
	justify-content: center;
	padding-top: 25%;
	.card {
		background: #fff;
		width: 95%;
		height: 40%;
		border-radius: 18rpx;
		padding: 10rpx;
		box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
	}
}
</style>